<?php
$this->title = '我的收藏';
?>
<body class="m-history">

<!-- 目前没有收藏类目-->
<!--<div class="nav" id="J_hisNav">-->
<!--    <a href="javascript:;" class="z-on" data-val="0">全部</a>-->
<!--    <a href="javascript:;" data-val="1">电器</a>-->
<!--    <a href="javascript:;" data-val="2">鞋类</a>-->
<!--</div>-->


<?php if(!empty($data)) { ?>
<div class="list" id="J_hisList">
    <?php foreach ($data as $item) { ?>
    <div class="J_trans">
        <img src=<?= $item['pic'] ?>>
        <h6>
            <a href="/web/product/detail?pid=<?= $item['P_Id']?>"><?= $item['p_name'] ?></a>
            <?php foreach ($item['attributes'] as $key => $val) { ?>
                <br><?= $key ?>:<?= $val ?>
            <?php }
            ?>
        </h6>
        <span>￥ <?= $item['price'] ?></span>
        <em data-id="<?= $item['ID'] ?>">删除</em>
    </div>
    <?php } ?>
</div>
<?php }?>

<script>

    function createList(info){

        var _list = '';
        for(var i in info){
            var _rs = info[i];
            _list += '<div class="J_trans">'+
                '<img src="'+ _rs['img'] +'">'+
                '<h6><a href="/web/product/detail?pid='+ i +'">'+ _rs['title'] +'</a><br>'+_rs['attr']+'</h6>'+
                '<span>￥ '+ _rs['price'] +'</span>'+
                '<em data-id="'+ i +'">删除</em>'+
                '</div>';
        }
        return _list;
    }

    $(function(){

        var list = $('#J_hisList'), zon = 'z-on';
        $('#J_hisNav').on('tap', 'a', function(){

            var _this = $(this);

            // 发送请求
            $.ajax({ url: 'ajax.fav.php?funcName=?', dataType:'jsonp', data:{'type':_this.attr('data-val')}, timeout:5000,

                success: function(_info){
                    console.log(_info);

                    list.html(createList(_info));
                }
            });

            _this.addClass(zon).siblings().removeClass(zon);
        });

        // 滑动删除[出现]
        var trans = 'z-trans';
        list.on('swipeLeft', 'div.J_trans', function(){

            var _this = $(this);

            if(_this.hasClass(trans)) return !1;

            list.find('div.J_trans').removeClass(trans);
            _this.addClass(trans);
        });

        // 滑动删除[隐藏]
        list.on('swipeRight', 'div.J_trans', function(){

            var _this = $(this);

            if(!_this.hasClass(trans)) return !1;

            _this.removeClass(trans);
        });

        // 点击删除
        list.on('tap', 'em', function(){

            var _this = $(this), _id = _this.attr('data-id');

            // Id值
            console.log(_id);
            $.ajax({ url: '/web/collection/remove?funcName=?', dataType:'jsonp', data:{'id':_id}, timeout:5000,

                success: function(_info){
                    _this.closest('div').remove();
                }
            });
        });
    });
</script>


</body>